<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>第一个页面</title>
</head>
<body>
<a href="two.html">去第二个页面</a>
<a href="four.html">去第四个页面</a>

<button  onclick="front()">上一个页面</button>
<button  onclick="next()">下一个页面</button>
<button  onclick="go2()">第三个页面</button>
<button id="002" onclick="changeStyle2()">第三个页面</button>
<input id="inp01" type="button" onclick="changeStyle()" value="改变样式"/>
<script>
    function changeStyle(){
        var elementById = document.getElementById("inp01");
        elementById.style.backgroundColor="red";
        elementById.style.border="3px soilder green";
        elementById.style.height="40px";
        elementById.style.width="100px";

    }
    function changeStyle2(){
        var elementById = document.getElementById("002");
        elementById.style.backgroundColor="red";
        elementById.style.border="3px soilder green";
        elementById.style.height="40px";
        elementById.style.width="100px";

    }
    function next(){
        history.forward();
    }
    function front(){
        history.back();
    }
    function go2(){
        history.go(2);
    }
</script>
</script>
</body>
</html>